﻿import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12


// 列表式表格，主要以行数据为单位，只能设置列标题
Item {

    id: root

    // public ==================================================================


    // 默认宽度填充父级，高度=Min(父级高度, 数据高度)
    height: Math.min(parent.height, titleHeight + lineHeight*tableData.length)
    width: parent.width

    property int lineHeight: 40*dp           // 行高
    property int titleHeight: 50*dp         // 标题高度

    property color lineColor: "white"       // 行背景色
    property color titleColor: "#F7F8FA"     // 标题背景色

    property bool showVGridLine: false        // 垂直网格线
    property bool showHGridLine: true         // 水平网格线
    property bool showTitle: true               // 是否显示表头
    property var title: [""]
    property int columnCount: title.length   // 表格列数(不包含操作列)
    property int rowCount: 0

    property int wordWrapMode: 0                // 文字过长时的显示策略 [0]省略号显示，Hover或点击时显示全部内容  [1]换行显示

    property bool showOperateButton: false      // 是否展示最右面的可操作列
    property var  operateButtonText: ["操作"]       // 操作列内容
    property real operateButtonWidth: showOperateButton ? (text_operateButtonWidth.contentWidth+operateButtonSpacing*(operateButtonText.length+1)) : 0      // 操作列宽度
    property var  operateButtonSpacing: 11*dp       // 在operateButtonWidth未设置时有效

    property bool showOperateButton2: false      // 是否展示最右面的可默认列
    property var  operateButtonText2: ["是否默认"]       // 操作列内容
    property real operateButtonWidth2: showOperateButton2 ? (text_operateButtonWidth.contentWidth+operateButtonSpacing*(operateButtonText.length+1)) : 0      // 操作列宽度
    property var  operateButtonSpacing2: 11*dp       // 在operateButtonWidth未设置时有效
    property string opname: "是否默认"

    property bool showSortButton: false

    function setData(data){         // 传入二维数组
        tableData = data
        rowCount = data.length
    }



    // 左侧选择框 ===============================
    property bool showCheckedBox: false
    property real checkedBoxWidth: showCheckedBox ? 60*dp : 0
    property var checkedList: []            // 返回true和false的数组，标记该列是否被选中


    signal resortData(var index)        // 重新排序(列号)
    signal operate(var index, var text, var hcname, var num, var zsqsum) // 点击操作(行号、操作标题)


    // private =================================================================

    function syncCheckList(){
        if(!showCheckedBox) return
        checkedList = []
        for(let i = 0; i < tableData.length; i ++){
            checkedList.push(false)
        }
        checkedListChanged()
    }
    property bool checkedMutex: false
    Component.onCompleted: {
        syncCheckList()
    }

    onTableDataChanged: {
        syncCheckList()
    }

    Text{       // 用于计算操作列需要的宽度
        id: text_operateButtonWidth
        visible: false
        text: {
            var res = ""
            for(let i = 0; i < operateButtonText.length; i ++){
                res = res + operateButtonText[i]
            } return res
        }
        font.pixelSize: config.fontsize
    }

    property int hoverIdx: -1       // 高亮显示的行
    property var tableData: []      // 二维数组

    // 表头
    Rectangle{
        visible: showTitle
        width: parent.width;  height: titleHeight
        color: titleColor
        // 选择框列
        // 数据列
        Row{
            x: checkedBoxWidth
            width: parent.width - operateButtonWidth - checkedBoxWidth - operateButtonWidth2
            Repeater{
                model: columnCount
                Item{
                    visible: index < columnCount
                    height: titleHeight
                    width: parent.width / columnCount
                    Text{
                        text: title[index]
                        anchors.centerIn: parent
                        font.pixelSize: config.fontsize
                    }CustomImage{     // 排序
                        id: image_sort
                        height: 14*dp; width: 14*dp
                        anchors.centerIn: parent
                        anchors.horizontalCenterOffset: parent.children[0].contentWidth/2 + 10*dp
                        source: "qrc:/picture/upDownArror1_0.png"
                        visible: false
                        opacity: 0.2
                    }
                    MouseArea{
                        height: 30*dp
                        width: parent.children[0].contentWidth + 10*dp
                        anchors.centerIn: parent
                        cursorShape: Qt.PointingHandCursor
                        visible: showSortButton
                        hoverEnabled: config.hoverEnabled
                        onEntered: {
                            image_sort.visible = hoverEnabled
                        }onExited: {
                            image_sort.visible = false
                        }
                        onReleased: {
                            resortData(index)
                        }
                    }
                }
            }

        }
        // 默认列
        Item{
            id: item_operateTitle2
            visible: showOperateButton2
            height: parent.height; width: operateButtonWidth2
            x: parent.width - width - item_operateTitle.width
            Text{
                text: "是否默认"
                anchors.centerIn: parent
                font.pixelSize: config.fontsize
            }
        }
        // 操作列
        Item{
            id: item_operateTitle
            visible: showOperateButton
            height: parent.height; width: operateButtonWidth
            x: parent.width - width
            Text{
                text: "操作"
                anchors.centerIn: parent
                font.pixelSize: config.fontsize
            }
        }
    }

    // 表格
    ListView{
        id: tableView
        clip: true
        y: showTitle ? titleHeight : 0
        width: root.width;    height: root.height - (showTitle ? titleHeight : 0)
        model: tableData.length
        delegate: lineDelegate
        ScrollBar.vertical: ScrollBar{ id: scrollBar }

    }



    // 行内容
    Component{
        id: lineDelegate
        Rectangle{
            property int lineIdx: index
            height: lineHeight
            width: root.width

            // 数据列
            Row{
                x: checkedBoxWidth
                width: parent.width - operateButtonWidth - checkedBoxWidth - operateButtonWidth2
                Repeater{
                    model: columnCount
                    Rectangle{
                        Rectangle{ visible: showVGridLine; height: parent.height; width: 1; color: Qt.rgba(0, 0, 0, 0.1) }       // 间隔线
                        visible: index < columnCount
                        color: lineColor
                        width: parent.width / columnCount
                        height: lineHeight
                        Text{
                            anchors.centerIn: parent
                            font.pixelSize: config.fontsize
                            text: tableData[lineIdx][index]
                        }
                    }
                }
            }
            // 默认列（右边那列）
            Item{
                visible: showOperateButton2
                Rectangle{ height: parent.height; width: 1; color: showVGridLine ? Qt.rgba(0, 0, 0, 0.1) : "transparent" }       // 间隔线
                height: parent.height
                width: operateButtonWidth2
                x: parent.width - width - item_operateTitle.width
                Row{
                    anchors.centerIn: parent
                    spacing: operateButtonSpacing2
                    CustomSwitchButton{
                        id:btmr
                        width: 30*dp
                        height: 18*dp
                        checked: tableData[lineIdx][4]==="True"
                        CustomTooltip{
                            visible: parent.isHovered
                            text: opname
                        }
                        onCheckedChanged: {
                            if(checked){
                                root.operate(lineIdx, "3",tableData[lineIdx][1],tableData[lineIdx][0],tableData[lineIdx][2])
                            }
                        }
                    }
                }
            }
            // 操作列（右边那列）
            Item{
                visible: showOperateButton
                Rectangle{ height: parent.height; width: 1; color: showVGridLine ? Qt.rgba(0, 0, 0, 0.1) : "transparent" }       // 间隔线
                height: parent.height
                width: operateButtonWidth
                x: parent.width - width
                Row{
                    anchors.centerIn: parent
                    spacing: operateButtonSpacing
                    Image {
                        id: bt1
                        width: 18*dp
                        height: 18*dp
                        source: isHovered?"qrc:/picture/pzwh_bj2.png":"qrc:/picture/pzwh_bj.png"
                        property bool isHovered: false
                        CustomTooltip{
                            visible: parent.isHovered
                            text: "编辑"
                        }
                        MouseArea{
                            anchors.fill: parent
                            cursorShape: "PointingHandCursor"
                            hoverEnabled: config.hoverEnabled
                            onEntered: {
                                bt1.isHovered = true && config.hoverEnabled
                            }onExited: {
                                bt1.isHovered = false
                            }
                            onReleased: {
                                root.operate(lineIdx, "1",tableData[lineIdx][1],tableData[lineIdx][0],tableData[lineIdx][2])
                            }
                        }
                    }
                    Image {
                        id: bt2
                        width: 18*dp
                        height: 18*dp
                        source: isHovered?"qrc:/picture/pzwh_sc2.png":"qrc:/picture/pzwh_sc.png"
                        property bool isHovered: false
                        CustomTooltip{
                            visible: parent.isHovered
                            text: "删除"
                        }
                        MouseArea{
                            anchors.fill: parent
                            cursorShape: "PointingHandCursor"
                            hoverEnabled: config.hoverEnabled
                            onEntered: {
                                bt2.isHovered = true && config.hoverEnabled
                            }onExited: {
                                bt2.isHovered = false
                            }
                            onReleased: {
                                syjx1.show()
                            }
                        }
                    }
                    CustomPopupBoxWarning{
                        id: syjx1
                        box_text: "是否删除?"
                        onAccepted: {
                            root.operate(lineIdx, "2",tableData[lineIdx][1],tableData[lineIdx][0],tableData[lineIdx][2])
                        }
                    }
                    Image {
                        id: bt4
                        width: 18*dp
                        height: 18*dp
                        source: isHovered?"qrc:/picture/pzwh_dc2.png":"qrc:/picture/pzwh_dc.png"
                        property bool isHovered: false
                        CustomTooltip{
                            visible: parent.isHovered
                            text: "导出"
                        }
                        MouseArea{
                            anchors.fill: parent
                            cursorShape: "PointingHandCursor"
                            hoverEnabled: config.hoverEnabled
                            onEntered: {
                                bt4.isHovered = true && config.hoverEnabled
                            }onExited: {
                                bt4.isHovered = false
                            }
                            onReleased: {
                                root.operate(lineIdx, "4",tableData[lineIdx][1],tableData[lineIdx][0],tableData[lineIdx][2])
                            }
                        }
                    }

//                    Repeater{
//                        model: operateButtonText.length
//                        Text{
//                            anchors.verticalCenter: parent.verticalCenter
//                            width: contentWidth
//                            height: contentWidth
//                            text: operateButtonText[index]
//                            horizontalAlignment: Text.AlignHCenter
//                            verticalAlignment: Text.AlignVCenter
//                            color: config.themeColor
//                            MouseArea{
//                                anchors.fill: parent
//                                cursorShape: "PointingHandCursor"
//                                onReleased: {
//                                    root.operate(lineIdx, parent.text)
//                                }
//                            }
//                            font.pixelSize: config.fontsize
//                        }
//                    }
                }
            }

            Rectangle{ visible: showVGridLine; height: parent.height; width: 1; x: parent.width-1; color: Qt.rgba(0, 0, 0, 0.1) }       // 间隔线

            Rectangle{ visible: showHGridLine; height: 1; width: parent.width; y: parent.height-1; color: Qt.rgba(0, 0, 0, 0.1) }       // 间隔线
        }
    }

}
